home *** CD-ROM | disk | FTP | other *** search
/ PC go! 2018 July / PCgo 07-2018 CD-ROM Germany.iso / nw.pak / Unnamed File 005236.txt < prev    next >
Encoding:
Text File  |  2015-07-29  |  14.0 KB  |  419 lines
  1. // Copyright 2014 The Chromium Authors. All rights reserved.
  2. // Use of this source code is governed by a BSD-style license that can be
  3. // found in the LICENSE file.
  4.  
  5. "use strict";
  6.  
  7. var xmlTreeViewerCSS = privateScriptController.import("DocumentXMLTreeViewer.css");
  8.  
  9. privateScriptController.installClass("Document", function(DocumentPrototype) {
  10.     var nodeParentPairs = [];
  11.     var tree;
  12.  
  13.     function prepareWebKitXMLViewer(noStyleMessage)
  14.     {
  15.         var html = createHTMLElement('html');
  16.         var head = createHTMLElement('head');
  17.         html.appendChild(head);
  18.         var style = createHTMLElement('style');
  19.         style.id = 'xml-viewer-style';
  20.         style.appendChild(document.createTextNode(xmlTreeViewerCSS));
  21.         head.appendChild(style);
  22.         var body = createHTMLElement('body');
  23.         html.appendChild(body);
  24.         var sourceXML = createHTMLElement('div');
  25.         sourceXML.id = 'webkit-xml-viewer-source-xml';
  26.         body.appendChild(sourceXML);
  27.  
  28.         var child;
  29.         while (child = document.firstChild) {
  30.             document.removeChild(child);
  31.             if (child.nodeType != Node.DOCUMENT_TYPE_NODE)
  32.                 sourceXML.appendChild(child);
  33.         }
  34.         document.appendChild(html);
  35.  
  36.         var header = createHTMLElement('div');
  37.         body.appendChild(header);
  38.         header.classList.add('header');
  39.         var headerSpan = createHTMLElement('span');
  40.         header.appendChild(headerSpan);
  41.         headerSpan.textContent = noStyleMessage;
  42.         header.appendChild(createHTMLElement('br'));
  43.  
  44.         tree = createHTMLElement('div');
  45.         body.appendChild(tree);
  46.         tree.classList.add('pretty-print');
  47.         window.onload = sourceXMLLoaded;
  48.     }
  49.  
  50.     function sourceXMLLoaded()
  51.     {
  52.         var sourceXML = document.getElementById('webkit-xml-viewer-source-xml');
  53.         if (!sourceXML)
  54.             return; // Stop if some XML tree extension is already processing this document
  55.  
  56.         for (var child = sourceXML.firstChild; child; child = child.nextSibling)
  57.             nodeParentPairs.push({parentElement: tree, node: child});
  58.  
  59.         for (var i = 0; i < nodeParentPairs.length; i++)
  60.             processNode(nodeParentPairs[i].parentElement, nodeParentPairs[i].node);
  61.  
  62.         drawArrows();
  63.         initButtons();
  64.  
  65.         return false;
  66.     }
  67.  
  68.     // Tree processing.
  69.  
  70.     function processNode(parentElement, node)
  71.     {
  72.         var map = processNode.processorsMap;
  73.         if (!map) {
  74.             map = {};
  75.             processNode.processorsMap = map;
  76.             map[Node.PROCESSING_INSTRUCTION_NODE] = processProcessingInstruction;
  77.             map[Node.ELEMENT_NODE] = processElement;
  78.             map[Node.COMMENT_NODE] = processComment;
  79.             map[Node.TEXT_NODE] = processText;
  80.             map[Node.CDATA_SECTION_NODE] = processCDATA;
  81.         }
  82.         if (processNode.processorsMap[node.nodeType])
  83.             processNode.processorsMap[node.nodeType].call(this, parentElement, node);
  84.     }
  85.  
  86.     function processElement(parentElement, node)
  87.     {
  88.         if (!node.firstChild)
  89.             processEmptyElement(parentElement, node);
  90.         else {
  91.             var child = node.firstChild;
  92.             if (child.nodeType == Node.TEXT_NODE && isShort(child.nodeValue) && !child.nextSibling)
  93.                 processShortTextOnlyElement(parentElement, node);
  94.             else
  95.                 processComplexElement(parentElement, node);
  96.         }
  97.     }
  98.  
  99.     function processEmptyElement(parentElement, node)
  100.     {
  101.         var line = createLine();
  102.         line.appendChild(createTag(node, false, true));
  103.         parentElement.appendChild(line);
  104.     }
  105.  
  106.     function processShortTextOnlyElement(parentElement, node)
  107.     {
  108.         var line = createLine();
  109.         line.appendChild(createTag(node, false, false));
  110.         for (var child = node.firstChild; child; child = child.nextSibling)
  111.             line.appendChild(createText(child.nodeValue));
  112.         line.appendChild(createTag(node, true, false));
  113.         parentElement.appendChild(line);
  114.     }
  115.  
  116.     function processComplexElement(parentElement, node)
  117.     {
  118.         var collapsible = createCollapsible();
  119.  
  120.         collapsible.expanded.start.appendChild(createTag(node, false, false));
  121.         for (var child = node.firstChild; child; child = child.nextSibling)
  122.             nodeParentPairs.push({parentElement: collapsible.expanded.content, node: child});
  123.         collapsible.expanded.end.appendChild(createTag(node, true, false));
  124.  
  125.         collapsible.collapsed.content.appendChild(createTag(node, false, false));
  126.         collapsible.collapsed.content.appendChild(createText('...'));
  127.         collapsible.collapsed.content.appendChild(createTag(node, true, false));
  128.         parentElement.appendChild(collapsible);
  129.     }
  130.  
  131.     function processComment(parentElement, node)
  132.     {
  133.         if (isShort(node.nodeValue)) {
  134.             var line = createLine();
  135.             line.appendChild(createComment('<!-- ' + node.nodeValue + ' -->'));
  136.             parentElement.appendChild(line);
  137.         } else {
  138.             var collapsible = createCollapsible();
  139.  
  140.             collapsible.expanded.start.appendChild(createComment('<!--'));
  141.             collapsible.expanded.content.appendChild(createComment(node.nodeValue));
  142.             collapsible.expanded.end.appendChild(createComment('-->'));
  143.  
  144.             collapsible.collapsed.content.appendChild(createComment('<!--'));
  145.             collapsible.collapsed.content.appendChild(createComment('...'));
  146.             collapsible.collapsed.content.appendChild(createComment('-->'));
  147.             parentElement.appendChild(collapsible);
  148.         }
  149.     }
  150.  
  151.     function processCDATA(parentElement, node)
  152.     {
  153.         if (isShort(node.nodeValue)) {
  154.             var line = createLine();
  155.             line.appendChild(createText('<![CDATA[ ' + node.nodeValue + ' ]]>'));
  156.             parentElement.appendChild(line);
  157.         } else {
  158.             var collapsible = createCollapsible();
  159.  
  160.             collapsible.expanded.start.appendChild(createText('<![CDATA['));
  161.             collapsible.expanded.content.appendChild(createText(node.nodeValue));
  162.             collapsible.expanded.end.appendChild(createText(']]>'));
  163.  
  164.             collapsible.collapsed.content.appendChild(createText('<![CDATA['));
  165.             collapsible.collapsed.content.appendChild(createText('...'));
  166.             collapsible.collapsed.content.appendChild(createText(']]>'));
  167.             parentElement.appendChild(collapsible);
  168.         }
  169.     }
  170.  
  171.     function processProcessingInstruction(parentElement, node)
  172.     {
  173.         if (isShort(node.nodeValue)) {
  174.             var line = createLine();
  175.             line.appendChild(createComment('<?' + node.nodeName + ' ' + node.nodeValue + '?>'));
  176.             parentElement.appendChild(line);
  177.         } else {
  178.             var collapsible = createCollapsible();
  179.  
  180.             collapsible.expanded.start.appendChild(createComment('<?' + node.nodeName));
  181.             collapsible.expanded.content.appendChild(createComment(node.nodeValue));
  182.             collapsible.expanded.end.appendChild(createComment('?>'));
  183.  
  184.             collapsible.collapsed.content.appendChild(createComment('<?' + node.nodeName));
  185.             collapsible.collapsed.content.appendChild(createComment('...'));
  186.             collapsible.collapsed.content.appendChild(createComment('?>'));
  187.             parentElement.appendChild(collapsible);
  188.         }
  189.     }
  190.  
  191.     function processText(parentElement, node)
  192.     {
  193.         parentElement.appendChild(createText(node.nodeValue));
  194.     }
  195.  
  196.     // Processing utils.
  197.  
  198.     function trim(value)
  199.     {
  200.         return value.replace(/^\s\s*/, '').replace(/\s\s*$/, '');
  201.     }
  202.  
  203.     function isShort(value)
  204.     {
  205.         return trim(value).length <= 50;
  206.     }
  207.  
  208.     // Tree rendering.
  209.  
  210.     function createHTMLElement(elementName)
  211.     {
  212.         return document.createElementNS('http://www.w3.org/1999/xhtml', elementName)
  213.     }
  214.  
  215.     function createCollapsible()
  216.     {
  217.         var collapsible = createHTMLElement('div');
  218.         collapsible.classList.add('collapsible');
  219.         collapsible.expanded = createHTMLElement('div');
  220.         collapsible.expanded.classList.add('expanded');
  221.         collapsible.appendChild(collapsible.expanded);
  222.  
  223.         collapsible.expanded.start = createLine();
  224.         collapsible.expanded.start.appendChild(createCollapseButton());
  225.         collapsible.expanded.appendChild(collapsible.expanded.start);
  226.  
  227.         collapsible.expanded.content = createHTMLElement('div');
  228.         collapsible.expanded.content.classList.add('collapsible-content');
  229.         collapsible.expanded.appendChild(collapsible.expanded.content);
  230.  
  231.         collapsible.expanded.end = createLine();
  232.         collapsible.expanded.appendChild(collapsible.expanded.end);
  233.  
  234.         collapsible.collapsed = createHTMLElement('div');
  235.         collapsible.collapsed.classList.add('collapsed');
  236.         collapsible.collapsed.classList.add('hidden');
  237.         collapsible.appendChild(collapsible.collapsed);
  238.         collapsible.collapsed.content = createLine();
  239.         collapsible.collapsed.content.appendChild(createExpandButton());
  240.         collapsible.collapsed.appendChild(collapsible.collapsed.content);
  241.  
  242.         return collapsible;
  243.     }
  244.  
  245.     function createButton()
  246.     {
  247.         var button = createHTMLElement('span');
  248.         button.classList.add('button');
  249.         return button;
  250.     }
  251.  
  252.     function createCollapseButton(str)
  253.     {
  254.         var button = createButton();
  255.         button.classList.add('collapse-button');
  256.         return button;
  257.     }
  258.  
  259.     function createExpandButton(str)
  260.     {
  261.         var button = createButton();
  262.         button.classList.add('expand-button');
  263.         return button;
  264.     }
  265.  
  266.     function createComment(commentString)
  267.     {
  268.         var comment = createHTMLElement('span');
  269.         comment.classList.add('comment');
  270.         comment.classList.add('html-comment');
  271.         comment.textContent = commentString;
  272.         return comment;
  273.     }
  274.  
  275.     function createText(value)
  276.     {
  277.         var text = createHTMLElement('span');
  278.         text.textContent = trim(value);
  279.         text.classList.add('text');
  280.         return text;
  281.     }
  282.  
  283.     function createLine()
  284.     {
  285.         var line = createHTMLElement('div');
  286.         line.classList.add('line');
  287.         return line;
  288.     }
  289.  
  290.     function createTag(node, isClosing, isEmpty)
  291.     {
  292.         var tag = createHTMLElement('span');
  293.         tag.classList.add('html-tag');
  294.  
  295.         var stringBeforeAttrs = '<';
  296.         if (isClosing)
  297.             stringBeforeAttrs += '/';
  298.         stringBeforeAttrs += node.nodeName;
  299.         var textBeforeAttrs = document.createTextNode(stringBeforeAttrs);
  300.         tag.appendChild(textBeforeAttrs);
  301.  
  302.         if (!isClosing) {
  303.             for (var i = 0; i < node.attributes.length; i++)
  304.                 tag.appendChild(createAttribute(node.attributes[i]));
  305.         }
  306.  
  307.         var stringAfterAttrs = '';
  308.         if (isEmpty)
  309.             stringAfterAttrs += '/';
  310.         stringAfterAttrs += '>';
  311.         var textAfterAttrs = document.createTextNode(stringAfterAttrs);
  312.         tag.appendChild(textAfterAttrs);
  313.  
  314.         return tag;
  315.     }
  316.  
  317.     function createAttribute(attributeNode)
  318.     {
  319.         var attribute = createHTMLElement('span');
  320.         attribute.classList.add('html-attribute');
  321.  
  322.         var attributeName = createHTMLElement('span');
  323.         attributeName.classList.add('html-attribute-name');
  324.         attributeName.textContent = attributeNode.name;
  325.  
  326.         var textBefore = document.createTextNode(' ');
  327.         var textBetween = document.createTextNode('="');
  328.  
  329.         var attributeValue = createHTMLElement('span');
  330.         attributeValue.classList.add('html-attribute-value');
  331.         attributeValue.textContent = attributeNode.value;
  332.  
  333.         var textAfter = document.createTextNode('"');
  334.  
  335.         attribute.appendChild(textBefore);
  336.         attribute.appendChild(attributeName);
  337.         attribute.appendChild(textBetween);
  338.         attribute.appendChild(attributeValue);
  339.         attribute.appendChild(textAfter);
  340.         return attribute;
  341.     }
  342.  
  343.     // Tree behaviour.
  344.  
  345.     function drawArrows()
  346.     {
  347.         var ctx = document.getCSSCanvasContext("2d", "arrowRight", 10, 11);
  348.  
  349.         ctx.fillStyle = "rgb(90,90,90)";
  350.         ctx.beginPath();
  351.         ctx.moveTo(0, 0);
  352.         ctx.lineTo(0, 8);
  353.         ctx.lineTo(7, 4);
  354.         ctx.lineTo(0, 0);
  355.         ctx.fill();
  356.         ctx.closePath();
  357.  
  358.         var ctx = document.getCSSCanvasContext("2d", "arrowDown", 10, 10);
  359.  
  360.         ctx.fillStyle = "rgb(90,90,90)";
  361.         ctx.beginPath();
  362.         ctx.moveTo(0, 0);
  363.         ctx.lineTo(8, 0);
  364.         ctx.lineTo(4, 7);
  365.         ctx.lineTo(0, 0);
  366.         ctx.fill();
  367.         ctx.closePath();
  368.     }
  369.  
  370.     function expandFunction(sectionId)
  371.     {
  372.         return function()
  373.         {
  374.             document.querySelector('#' + sectionId + ' > .expanded').className = 'expanded';
  375.             document.querySelector('#' + sectionId + ' > .collapsed').className = 'collapsed hidden';
  376.         };
  377.     }
  378.  
  379.     function collapseFunction(sectionId)
  380.     {
  381.         return function()
  382.         {
  383.             document.querySelector('#' + sectionId + ' > .expanded').className = 'expanded hidden';
  384.             document.querySelector('#' + sectionId + ' > .collapsed').className = 'collapsed';
  385.         };
  386.     }
  387.  
  388.     function initButtons()
  389.     {
  390.         var sections = document.querySelectorAll('.collapsible');
  391.         for (var i = 0; i < sections.length; i++) {
  392.             var sectionId = 'collapsible' + i;
  393.             sections[i].id = sectionId;
  394.  
  395.             var expandedPart = sections[i].querySelector('#' + sectionId + ' > .expanded');
  396.             var collapseButton = expandedPart.querySelector('.collapse-button');
  397.             collapseButton.onclick = collapseFunction(sectionId);
  398.             collapseButton.onmousedown = handleButtonMouseDown;
  399.  
  400.             var collapsedPart = sections[i].querySelector('#' + sectionId + ' > .collapsed');
  401.             var expandButton = collapsedPart.querySelector('.expand-button');
  402.             expandButton.onclick = expandFunction(sectionId);
  403.             expandButton.onmousedown = handleButtonMouseDown;
  404.         }
  405.  
  406.     }
  407.  
  408.     function handleButtonMouseDown(e)
  409.     {
  410.        // To prevent selection on double click
  411.        e.preventDefault();
  412.     }
  413.  
  414.     DocumentPrototype.transformDocumentToTreeView = function(noStyleMessage) {
  415.         prepareWebKitXMLViewer(noStyleMessage);
  416.     }
  417. });
  418.  
  419.